<template>
	<view v-if="!userName && !password" class="container">
		<view class="top">
			<image src="../../static/bg2.png" mode="widthFix" style="width: 100%; margin-top: -35rpx;"></image>
		</view>

		<view class="logo">
			<image class="logo" src="../../static/paiLogo2.png" mode=""></image>
		</view>
		<!-- <view class="title">
			<image src="https://img1.imgtp.com/2023/01/16/4pNx8J4f.png" mode=""></image>
		</view> -->


		<view style="padding:40rpx; display: flex;align-items: center;width: 100%;">
			<view class="con"
				style="z-index: 999; background-color: #fff; padding:50px 20px 20px;margin-top: -140rpx; width: 100%;    border-radius: 34rpx;">
				<uni-forms ref="form" :model="user" :rules="rules">
					<uni-forms-item>
						<text style="font-size: 50rpx;"><b>欢迎登录</b></text>
					</uni-forms-item>
					<uni-forms-item name="Account">
						<uni-easyinput type="text" v-model="user.Account" placeholder="请输入账号" />
					</uni-forms-item>
					<uni-forms-item name="PassWord">
						<uni-easyinput v-model="user.PassWord" type="password" placeholder="密码" @confirm="toPage">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item>
						<button @click="toPage" type="primary"
							style="margin-top:25rpx; font-weight:700;  background-color:#D1100B;">登 录</button>
					</uni-forms-item>
					<view class="logo_xieyi">
						<!-- <label @click="moutcl" :class="gouxSta?'cuIcon-squarecheckfill':'cuIcon-square'"></label> -->
						<checkbox-group @change="moutcl">
							<checkbox value="1" color="#d1100b" activeBorderColor="#d1100b"
								style="display: flex;justify-content: center;align-items: center;" />
						</checkbox-group>
						<view class="logo_text">我已阅读并同意<text @click="toCPage(1)">《服务协议》</text>和<text
								@click="toCPage(0)">《隐私政策》</text></view>
					</view>
					<uni-forms-item>
						<view style="display: flex;justify-content: space-between;">
							<view class="textbox">
								<text @click="forget">忘记密码?</text>
								<text @click="register">注册账号</text>
							</view>
						</view>
						<!-- <view class="vxlogin">
							<image @click="wxLogin" src="/static/wx.png" mode=""></image>
						</view> -->
					</uni-forms-item>
				</uni-forms>
			</view>
		</view>

	</view>
</template>

<script>
	import code from '../../uni_modules/uview-ui/libs/config/props/code'
	export default {
		data() {
			return {
				gouxSta: false, //是否勾选用户协议
				rules: {
					Account: {
						rules: [{
							required: true,
							errorMessage: '请输入账号',
						}]
					},
					PassWord: {
						rules: [{
							required: true,
							errorMessage: '请输入密码',
						}]
					},
				},
				user: {
					Account: '',
					PassWord: '',
				},
				radio: [],
				hobby: [{
					text: '离线模式',
					value: 1
				}],
				userName: uni.getStorageSync('userName'),
				password: uni.getStorageSync('password')
			}
		},
		onShow() {
			let userName = uni.getStorageSync('userName')
			let password = uni.getStorageSync('password')
			if (userName && password) {
				uni.switchTab({
					url: '/pages/TakePict/TakePict'
				})
			}
		},
		onLoad() {
			let userName = uni.getStorageSync('userName')
			let password = uni.getStorageSync('password')
			if (userName && password) {
				uni.switchTab({
					url: '/pages/TakePict/TakePict'
				})
			}
			// 判断设备是否为iPhone并判断版本
			uni.getSystemInfo({
				success: (res) => {
					console.log(res)
					this.system = res.system // ios
					this.platform = res.platform // 14.3
				}
			})
		},
		methods: {
			// 跳转隐私协议webview页面
			toCPage(e) {
				uni.navigateTo({
					url: '/pages/user/customerPage?Type=' + e
				})
			},
			// 隐私协议选择
			moutcl(e) {

				if (e.detail.value.length > 0) {
					this.gouxSta = true
				} else {
					this.gouxSta = false
				}
			},
			// 登录
			toPage() {
				if (!this.gouxSta) return uni.showToast({
					"title": "请阅读并勾选用户协议",
					"icon": 'none'
				})
				this.$refs.form.validate().then(obj => {
					uni.showLoading({
						title: '登录中'
					})
					this.$http('Base_Manage/Home/AppSubmitLogin', {
						"userName": obj.Account,
						"password": obj.PassWord,
					}).then(res => {
						console.log(res)
						if (res.Success) {
							uni.setStorageSync('userName', obj.Account)
							uni.setStorageSync('password', obj.PassWord)
							uni.setStorageSync('tokenKey', 'Bearer ' + res.Data);
							this.getUserInfo()
						} else uni.showToast({
							icon: 'none',
							title: res.Msg
						})
						uni.hideLoading()

					})
				})
			},
			getUserInfo() {
				this.$http('Base_Manage/Home/GetAppOperatorInfo').then(res => {
					uni.setStorageSync('userInfo', res.Data)
					uni.switchTab({
						url: '/pages/TakePict/TakePict'
					})
				})
			},
			forget() {
				uni.navigateTo({
					url: '/pages/index/forget'
				})
			},
			register() {
				uni.navigateTo({
					url: '/pages/index/register'
				})
			},
			appleLogin() {
				uni.login({
					provider: 'apple',
					success: loginRes => {
						uni.getUserInfo({
							provider: 'apple',
							success: userInfoRes => {
								console.log('获取用户信息成功' + JSON.stringify(userInfoRes))
							}
						})
					},
					fail: err => {
						// console.log('apple登录失败' + JSON.stringify(err))
						uni.showToast({
							title: '登录失败',
							icon: 'none'
						})
					}
				})
			},
			wxLogin() {
				if (!this.gouxSta) return uni.showToast({
					"title": "请阅读并勾选用户协议",
					"icon": 'none'
				})
				uni.login({
					provider: 'weixin',
					onlyAuthorize: true,
					success: (result) => {
						console.log(result);
						this.wxLoginApi(result.code)
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							title: '微信授权获取失败,请重新尝试'
						})
					}
				})
			},
			wxLoginApi(code) {
				uni.showLoading()
				this.$http('Base_Manage/Base_VIPUserInfo/GetWxAccessToken?Code=' + code + '&AppType=xunjiango', ).then(
					res => {
						console.log(res);
						uni.hideLoading()
						if (res.Success) {
							this.wxSubLogin(res.Data.unionid)
						} else {
							uni.showToast({
								icon: 'none',
								title: res.Msg
							})
						}
					})
			},
			wxSubLogin(unionid) {
				this.$http('Base_Manage/Base_VIPUserInfo/GetVIPUserInfoData', {
					unionid
				}).then(res => {
					console.log(res);
					uni.hideLoading()
					if (res.Success) {
						if (res.Data.Token) {
							uni.setStorageSync('tokenKey', 'Bearer ' + res.Data.Token)
							this.getUserInfo()
						} else {
							uni.navigateTo({
								url: `/pages/index/wxLogin?unionid=${unionid}`,
							})
						}
					} else {
						uni.showToast({
							icon: 'none',
							title: res.Msg
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		width: 100vw;
		height: 100vh;
		position: relative;
		overflow: hidden;
		background-color: #f4f7f9;

		.logo {
			width: 243rpx;
			height: 200rpx;
			margin: 0 auto;
			border-radius: 20px;
			margin-top: -20vh;

		}

		.form {
			position: absolute;
			right: 0;
			left: 0;
			top: 0;
			bottom: 0;
			margin: 0 auto;
		}

		.textbox {
			width: 100%;
			padding-top: 50rpx;
			font-weight: bold;
			font-size: 16px;
			display: flex;
			justify-content: space-between;
		}

		.vxlogin {
			text-align: center;
			padding: 50rpx 10rpx;
			width: 100%;
			display: flex;
			justify-content: space-around;

			image {
				width: 50px;
				height: 50px;
			}

		}

		.logo_xieyi {
			width: 100%;
			// height: 80rpx;
			line-height: 80rpx;
			display: flex;
			flex-direction: row;
			margin-top: 30upx;
			align-items: center;
			color: #444;
			font-size: 27rpx;
			justify-content: center;
		}

		.logo_xieyi label {
			font-size: 26rpx;
			margin-right: 1%;
			display: block;
			width: 30rpx;
			height: 30rpx;
		}

		.cuIcon-squarecheckfill {
			color: #66afff;
		}

		.logo_text text {
			color: #d1100b;
		}

		.cuIcon-squarecheckfill {
			background: #d1100b;
			position: relative;
			border: 2px #ccc solid;
			box-sizing: border-box;
			border-radius: 3px;
		}

		.cuIcon-square {
			background: #fff;
			border: 2px #ccc solid;
			box-sizing: border-box;
			border-radius: 3px;
		}

	}

	/deep/ .uni-checkbox-input {
		width: 15px;
		height: 15px;
	}
</style>